'use strict';
//粉丝列表
import React,{Component} from 'react';
import Header from '../../common/header';
import * as URLconstant from '../../constant/URLconstant'
import Util from '../../common/util';
import {
    View,
    Text,
    TouchableOpacity,
    Image,
    StyleSheet,
    ScrollView,
    ListView
} from 'react-native';
export default class fansList extends Component{
    // 构造
      constructor(props) {
        super(props);
        // 初始状态
        this.state = {
            loaded:true,
            fansClass:0,
            fansList:[]
        };
      }

    componentDidMount() {
        this.getFans()
    }

      getFans(){
          let url = URLconstant.FANS_LIST
          let datakey=[]
          datakey['user_id']=this.props.user_id
          Util.get(url,datakey,this.getFansSuc.bind(this),this.errorCallback.bind(this))
      }

    getFansSuc(datas){
        if(datas.status==0){
            this.setState({
                loaded:false,
                fansData:datas.data,
                fansList:datas.data.first_fans_list
            })
        }
    }

    errorCallback(err){

    }

    selectFansClass(fansClass){
          let fansList
        let fansData = this.state.fansData
        if(fansClass==0){
            fansList=fansData.first_fans_list
        }else if(fansClass==1){
            fansList=fansData.second_fans_list
        }else{
            fansList=fansData.third_fans_list
        }
        fansList=fansList==null?[]:fansList
          this.setState({
              fansClass:fansClass,
              fansList:fansList
          })
    }

    backDate(add_time){
        let date = new Date(add_time*1000)
        let year = date.getFullYear() + '-';
        let month = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
        let day = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
        let hours = (date.getHours()<10?'0'+date.getHours():date.getHours())+":"
        let minutes = (date.getMinutes()<10?'0'+date.getMinutes():date.getMinutes())+":"
        let seconds = date.getSeconds()<10?'0'+date.getSeconds():date.getSeconds()
        let timeTxt = year+month+day+hours+minutes+seconds
        return timeTxt
    }

      render(){
          let fansClass = this.state.fansClass
          let fansList = this.state.fansList
          return(
              <View style={{flex:1,backgroundColor:"#f0f0f0"}}>
                  <Header navigator={this.props.navigator} initObj={{ title: '粉丝列表',id:2}}/>
                  {
                      this.state.loaded?
                          <View style={{flex:1}}>
                              {Util.loading()}
                          </View>
                          :
                          <View style={{flex:1}}>
                              <View style={{flex:1}}>
                                  <View style={styles.header_view}>
                                      <TouchableOpacity onPress={()=>this.selectFansClass(0)} style={styles.header_item}>
                                        <Text style={fansClass==0?{fontSize:14,color:"#f00"}:{fontSize:14,color:"#666"}}>一级粉丝({this.state.fansData.first_fans_count})</Text>
                                      </TouchableOpacity>
                                      <TouchableOpacity onPress={()=>this.selectFansClass(1)}  style={styles.header_item}>
                                        <Text style={fansClass==1?{fontSize:14,color:"#f00"}:{fontSize:14,color:"#666"}}>二级粉丝({this.state.fansData.second_fans_count})</Text>
                                      </TouchableOpacity>
                                      <TouchableOpacity onPress={()=>this.selectFansClass(2)}  style={styles.header_item}>
                                        <Text style={fansClass==2?{fontSize:14,color:"#f00"}:{fontSize:14,color:"#666"}}>其他粉丝({this.state.fansData.third_fans_count})</Text>
                                      </TouchableOpacity>
                                  </View>
                                  {
                                      fansList.length==0?
                                          <View style={{flex:1,alignItems:'center',justifyContent:'center'}}>
                                              <Text>没有粉丝列表</Text>
                                          </View>
                                          :
                                          <ScrollView style={{flex:1}}>
                                              {
                                                  fansList.map((item,index)=>{
                                                      return(
                                                          <View key={index} style={styles.fans_item}>
                                                              <Image
                                                                  source={{uri:item.headimage}}
                                                                  style={{width:80,height:80}}
                                                                  resizeMode={'cover'}
                                                              />
                                                              <View style={styles.item_right}>
                                                                  <Text style={{fontSize:14,color:"#333"}}>昵称:{item.nickname}</Text>
                                                                  <Text style={{fontSize:14,color:"#666"}}>粉丝团队:{item.fans_count}</Text>
                                                                  <Text style={{fontSize:14,color:"#666"}}>加入时间:{this.backDate(item.add_time)}</Text>
                                                              </View>
                                                          </View>
                                                      )
                                                  })
                                              }
                                          </ScrollView>
                                  }

                              </View>
                          </View>
                  }
              </View>
          )
      }
}
var styles = StyleSheet.create({
    header_view:{
        backgroundColor:"#fff",
        height:40,
        flexDirection:'row',
        alignItems:'center',
        width:Util.size.width
    },
    header_item:{
        flex:1,
        alignItems:'center',
        justifyContent:'center',
        height:40,
    },
    fans_item:{
        padding:10,
        backgroundColor:"#fff",
        flexDirection:'row',
    },
    item_right:{
        flex:1,
        paddingLeft:10,
        justifyContent:'space-between'
    }
})